class Cart2 {
    constructor() {
        this.getCart2();
        //绑定事件委托
        this.$('.item-box').addEventListener('click', this.Entrust);
        //点击绑定全选
        this.$('.list-head input').addEventListener('click', this.Choice);

    }
    Entrust = (eve) => {
        //console.log(eve.target);
        let target = eve.target;
        //判断点击的是不是删除
        if (target.nodeName == 'I' && target.classList.contains('del')) this.delEntrust(target)
        //console.log(eve.target);
        //判断点击的是不是＋
        if (target.nodeName == 'A' && target.classList.contains('jia')) this.plusMix(target)
        if (target.nodeName == 'A' && target.classList.contains('jian')) this.plusMin(target)
    }
    //数量减
    plusMin=(tar => {
        //console.log(tar);
        let div = tar.parentNode.parentNode.parentNode;
        //console.log(div);
        //console.log(div);
        //获取 单价 数量 合计价格
        let num = div.querySelector('.jiJian').innerHTML - 0;
        let numMix = div.querySelector('.numMix');
        let npm = div.querySelector('.pre-infox');
        //console.log(npm);

        let numX = numMix.value - 0;
        if(numX>0){
            numX--;
        }
        //numX--;
        //console.log(numMix);
        //发送请求
        const AUTH_TOKEN = localStorage.getItem('token')
        axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
        let uId = localStorage.getItem('user_id');
        let divx = div.parentNode.dataset.id;
        //console.log(divx);
        let param = `id=${uId}&goodsId=${divx}&number=${numX}`;
        axios.post('http://localhost:8888/cart/number', param).then(res => {
            //console.log(res.data.code);
            if (res.status == 200 && res.data.code == 1) {
                //console.log(res);
                numMix.value = numX;
                //location.reload();
                npm.innerHTML = num * numX;
                this.price();
            }
        })
    })
    //数量增加
    plusMix = (tar => {
        //console.log(tar);
        let div = tar.parentNode.parentNode.parentNode;
        //console.log(div);
        //console.log(div);
        //获取 单价 数量 合计价格
        let num = div.querySelector('.jiJian').innerHTML - 0;
        let numMix = div.querySelector('.numMix');
        let npm = div.querySelector('.pre-infox');
        //console.log(npm);

        let numX = numMix.value - 0;
        numX++;
        //console.log(numMix);
        //发送请求
        const AUTH_TOKEN = localStorage.getItem('token')
        axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
        let uId = localStorage.getItem('user_id');
        let divx = div.parentNode.dataset.id;
        //console.log(divx);
        let param = `id=${uId}&goodsId=${divx}&number=${numX}`;
        axios.post('http://localhost:8888/cart/number', param).then(res => {
            //console.log(res.data.code);
            if (res.status == 200 && res.data.code == 1) {
                //console.log(res);
                numMix.value = numX;
                //location.reload();
                npm.innerHTML = num * numX
                this.price();
            }
        })
    })
    //统计选中的价格
    price() {
        let sum=0;
        let tumm=0;
        this.$('#danXuanKuang').forEach(input => {
            //console.log(input);
            //console.log(input.parentNode.parentNode);
            //判断 只选择选中的
            if (input.checked) {
                //找到单选对应的父元素
                let item = input.parentNode.parentNode;
                //找到对应的价格
                let price = item.querySelector('.pre-infox').innerHTML - 0
                //console.log(price);
            
                //找到对应的数量
                let tum=item.querySelector('.numMix').value-0;
                sum+= price;
                tumm+=tum;
            }
        })
       
        //精度丢失
        sum=parseInt(sum*100)/100;
         console.log(sum,tumm);
        //sum=sum.toFixed(2);
        this.$('.heji').innerHTML = sum;
        this.$('.jianShu').innerHTML=tumm;
        // console.log( this.$('.jianShu').innerHTML);
        // console.log( this.$('.heji').innerHTML);
    }
    //单选
    SingleChoice() {
        //console.log(111);
        this.$('.icon-checkbox').forEach(input => {
            //将this指向保存
            let set = this;
            //console.log(input);
            input.onclick = function () {
                //console.log(this.checked);
                if (!this.checked) {
                    set.$('.list-head input').checked = false;
                }
                if (this.checked) {
                    let status = set.oneSingleChoice();
                    // console.log(status);
                    set.$('.list-head input').checked = status;
                }
                set.price();
            }

        })

    }
    //点击单个选择
    oneSingleChoice() {

        let res = Array.from(this.$('#danXuanKuang')).find(input => {
            // console.log(!input.checked);
            return !input.checked;
        })

        return !res;
        //console.log(res);
    }
    //点击全选
    Choice = (eve) => {
        //console.log(eve.target);
        //console.log( eve.target.checked); 
        let check = eve.target.checked;
        //console.log(check);
        this.ChoiceAll(check);
        this.price();
    }
    ChoiceAll(status) {
        //console.log(this.$('.icon-checkbox'));
        //遍历出每个商品
        this.$('.icon-checkbox').forEach(res => {
            res.checked = status;
        })

    }

    //删除购物车的某个商品
    delEntrust(tar) {
        //console.log(tar.parentNode.parentNode.parentNode);

        //console.log(gId,uId);
        let index = layer.confirm('确定要删除吗', {}, function () {
            //找到id 的所在
            let gg = tar.parentNode.parentNode.parentNode;
            //console.log(gg);
            let gId = gg.dataset.id;
            let uId = localStorage.getItem('user_id')
            const AUTH_TOKEN = localStorage.getItem('token')
            axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
            axios.get('http://localhost:8888/cart/remove', {
                params: {
                    id: uId,
                    goodsId: gId,
                }
            }).then(res => {
                //console.log(res);

                //location.reload();
                //无刷新关闭
                layer.close(index);
                gg.remove();
            })

        },
        )



    }
    //获取购物车信息
    async getCart2() {
        const AUTH_TOKEN = localStorage.getItem('token')
        axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
        let { data, status } = await axios.get('http://localhost:8888/cart/list', {
            params: {
                id: localStorage.getItem('user_id')
            }
        })
        //console.log(data,status);
        //判断axios状态是否正常
        if (data.code == 1 && status == 200) {
            let html = ''
            data.cart.forEach(goods => {
                //console.log(goods);
                html += `<div data-v-33432b6e="" class="item-table" data-id="${goods.goods_id}">
               <div data-v-33432b6e="" class="item-row clearfix">
                   <div data-v-33432b6e="" class="col col-check"><input type="checkbox" data-v-33432b6e=""
                           class="iconfont icon-checkbox icon-checkbox-selected danXuanKuang " id="danXuanKuang"></input>
                   </div>
                   <div data-v-33432b6e="" class="col col-img"><a data-v-33432b6e=""
                           href="javascript:void(0)"><img data-v-33432b6e="" alt=""
                               src="${goods.img_small_logo}"
                               width="80" height="80"></a></div>
                   <div data-v-33432b6e="" class="col col-name">
                       <div data-v-33432b6e="" class="tags">

                       </div>

                       <h3 data-v-33432b6e="" class="name"><a data-v-33432b6e=""
                               href="javascript:void(0)">${goods.title}</a></h3>

                   </div>
                   <div data-v-33432b6e="" class="col col-price jiJian">${goods.current_price}</div>
                   <div data-v-33432b6e="" class="col col-num">
                       <div data-v-33432b6e="" class="change-goods-num clearfix"><a
                               data-v-33432b6e="" href="javascript:void(0)" class="iconfont jian"></a>
                                   <input
                               data-v-33432b6e="" type="text" autocomplete="off"
                               class="goods-num numMix" name='' value="${goods.cart_number}" >
                               <a data-v-33432b6e=""
                               href="javascript:void(0)" class="iconfont jia"></a>

                       </div>
                   </div>
                   <div data-v-33432b6e="" class="col col-total">
                   <p data-v-33432b6e=""
                           class="pre-info pre-infox">
                           ${goods.current_price * goods.cart_number}
                       </p>
                   </div>
                   <div data-v-33432b6e="" class="col col-action"><i
                               data-v-33432b6e="" class="iconfont del " ></i></div>
               </div>
           </div>`
            });
            this.$('.item-box').innerHTML += html;
            //单选的绑定
            this.SingleChoice();

        }
        //账号过期 跳转至登录页面
        if (data.code == 401 && status == 200) {
            localStorage.removeItem('user_id');
            localStorage.removeItem('token');
            location.assign('./login.html?ReturnUrl=./cart2.html')
        }

    }
    $(ele) {
        let res = document.querySelectorAll(ele);
        return res.length == 1 ? res[0] : res;
    }
}
new Cart2;